import React, { PureComponent } from 'react';
import { connect } from 'react-redux';
import { withRouter , Link } from 'react-router-dom';
import styles from './style.module.scss';
import { dateRegExp } from '../../config/utils';
class MusicScoreRowCard extends PureComponent {
    render () {
        /**
         * state 1 热门 2最新
         */
        const { data , state} = this.props;
        return (
            <Link className={styles['card']} target="_blank" to={{
                pathname: "/scoreParticulars",
                search: `score_id=${data['id']}&state=${state}`
              }}>
                <div className={styles['card-img']}>
                    <img src={data['singerImg'] ? data['singerImg'] : 'https://mobuz-live.oss-cn-hangzhou.aliyuncs.com/web/matter/image/img_baise_book%402x.png'} alt=""/>
                </div>
                <div className={styles['card-container']}>
                    <div className={styles['card-title']}>{data['name']}</div>
                    <div className={styles['singer']}>
                        <div className={styles['singer-name']}>{data['singer']}</div>
                        <div className={styles['upload-time']}>
                            {
                                (()=>{
                                    if (state === 1 ) {
                                        return (
                                            <div>
                                                <img src="http://mobuz-live.oss-cn-hangzhou.aliyuncs.com/web/icon/icon_redu_gray%402x.png" alt="热度"/>
                                                <span>{data['hot']}</span>
                                            </div>
                                        )
                                    } else {
                                        return (
                                            <div>
                                                <img src="http://mobuz-live.oss-cn-hangzhou.aliyuncs.com/web/icon/icon_riqi_gray%402x.png" alt="时间"/>
                                                <span>{dateRegExp(data['updateTime'] || data['createTime'],'yyyy-MM-dd hh:mm')}</span>
                                            </div>
                                        )
                                    }
                                })()
                            }
                           
                        </div>
                    </div>
                </div>
            </Link>
        )
    }
}

const mapState = (state) => ({

});

const mapDispatch = (dispatch) => ({

});


export default connect(mapState, mapDispatch)(withRouter(MusicScoreRowCard));